<template>
	<el-dialog title="重置密码" :visible.sync="showChangePwd" :before-close="cancelPwd" width="360px" append-to-body="true" custom-class="super-change-password">
		<el-form :model="userInfo" status-icon :rules="pwdRules" ref="pwdForm" label-width="100px">
			<el-form-item label="新密码" prop="pass">
				<el-input type="password" v-model="userInfo.pass" autocomplete="off" show-password minlength="1"></el-input>
			</el-form-item>
			<el-form-item label="确认新密码" prop="checkPass">
				<el-input type="password" v-model="userInfo.checkPass" autocomplete="off" show-password minlength="1"></el-input>
			</el-form-item>
		</el-form>
		<div class="btns">
			<el-button @click="cancelPwd">取消</el-button>
			<el-button @click="changePwd" type="primary">确认</el-button>
		</div>
	</el-dialog>
</template>

<script>
import { adminUpdateAccountInfo } from '../../api/api';
export default {
	components: {},
	props: {
		show: {
			type: Boolean,
			default: false
		},
		userId: {
			type: String,
			default: ''
		}
	},
	data() {
		const validatePassChecked = (rule, value, callback) => {
			const chineseRegex = /[\u4e00-\u9fff]/;
			if (chineseRegex.test(value)) {
				callback(new Error('格式错误，用户名只能是英文、数字以及 - @ ~ _ 等特殊字符'));
				return;
			}
			if (!value || value.length < 8) {
				callback(new Error('密码强度不足，密码长度至少8个字符，且必须包含大、小写字母、数字、特殊字符'));
			} else if (value !== this.userInfo.pass) {
				callback(new Error('两次输入密码不一致!'));
			} else {
				const uppercaseRegex = /[A-Z]/;
				const lowercaseRegex = /[a-z]/;
				const specialCharRegex = /[!@#$%^&*_\-+={}\[\]\\|;:"'<>,.\/?]/;
				const digitRegex = /[0-9]/;
				let matchNum = 0;
				if (uppercaseRegex.test(value)) matchNum++;
				if (lowercaseRegex.test(value)) matchNum++;
				if (specialCharRegex.test(value)) matchNum++;
				if (digitRegex.test(value)) matchNum++;
				if (matchNum < 4) {
					callback(new Error('密码强度不足，密码长度至少8个字符，且必须包含大、小写字母、数字、特殊字符'));
				} else {
					callback();
				}
			}
		};

		const validatePass = (rule, value, callback) => {
			const chineseRegex = /[\u4e00-\u9fff]/;
			if (chineseRegex.test(value)) {
				callback(new Error('格式错误，用户名只能是英文、数字以及 - @ ~ _ 等特殊字符'));
				return;
			}
			if (!value || value.length < 8) {
				callback(new Error('密码强度不足，密码长度至少8个字符，且必须包含大、小写字母、数字、特殊字符'));
			} else {
				const uppercaseRegex = /[A-Z]/;
				const lowercaseRegex = /[a-z]/;
				const specialCharRegex = /[!@#$%^&*_\-+={}\[\]\\|;:"'<>,.\/?]/;
				const digitRegex = /[0-9]/;
				let matchNum = 0;
				if (uppercaseRegex.test(value)) matchNum++;
				if (lowercaseRegex.test(value)) matchNum++;
				if (specialCharRegex.test(value)) matchNum++;
				if (digitRegex.test(value)) matchNum++;
				if (matchNum < 4) {
					callback(new Error('密码强度不足，密码长度至少8个字符，且必须包含大、小写字母、数字、特殊字符'));
				} else {
					callback();
				}
			}
		};
		return {
			userInfo: {
				userId: '',
				pass: '',
				checkPass: ''
			},

			pwdRules: {
				pass: [
					{ required: true, message: '请输入用户密码', trigger: ['blur', 'change'] },
					{ validator: validatePass, trigger: ['blur', 'change'] }
				],
				checkPass: [
					{ required: true, message: '请输入用户密码', trigger: ['blur', 'change'] },
					{ validator: validatePassChecked, trigger: ['blur', 'change'] }
				]
			},
			showChangePwd: false
		};
	},
	watch: {
		show(newVal) {
			this.showChangePwd = newVal;
		},
		userId(newVal) {
			this.userInfo.userId = newVal;
		}
	},
	computed: {},
	mounted() {},
	methods: {
		cancelPwd() {
			this.showChangePwd = false;
			this.userInfo.pass = '';
			this.userInfo.checkPass = '';
			this.validatePwd = false;
			this.$refs.pwdForm.resetFields();
			this.$emit('close');
		},
		changePwd() {
			this.$refs['pwdForm'].validate(valid => {
				if (valid) {
					let params = [
						{ op: 'replace', path: '/pwd', value: this.userInfo.pass } // 设置该用户是否失效   Y/失效  N/没有失效
					];
					let self = this;
					let data = {};
					data.userId = this.userInfo.userId;
					data.params = params;
					adminUpdateAccountInfo(data)
						.then(function (resp) {
							if (resp.data && resp.data.code === 200) {
								self.$message.success('密码重置成功');
								self.$emit('close');
								self.showChangePwd = false;
								self.$refs.pwdForm.resetFields();
							} else {
								self.$message.error(resp.data.description);
							}
						})
						.catch(function (error) {
							console.log('update password error', error);
							self.$requestApiError(error, () => {
								self.$router.push('/super');
							});
						});
				}
			});
		}
	}
};
</script>

<style lang="less">
.super-change-password {
	.btns {
		text-align: right;
	}
	.head {
		padding: 20px 0;
	}
	.el-avatar > img {
		width: 100%;
	}

	.el-form-item {
		margin-bottom: 40px;
	}
}
</style>
